<template>

    <div>
        <el-form ref="ruleFormRef" style="max-width: 600px" :model="ruleForm" :rules="rules" label-width="auto">
            <el-form-item prop="email" label="容量">
                <el-input v-model="ruleForm.totalSpace" placeholder="请设置容量">
                    <template #suffix>
                        {{ size.sizetoStr(ruleForm.totalSpace) }}
                    </template>
                </el-input>

            </el-form-item>
            <div>最大容量：{{ size.sizetoStr(999999999999999999) }}</div>
            <el-form-item>
                <el-button type="primary" @click="setrl">设置容量</el-button>
            </el-form-item>

        </el-form>
    </div>
</template>
<script setup>
import service from '@/utils/Request';
import { onMounted, ref } from 'vue';
import { ElMessage } from 'element-plus'
import size from "@/utils/utils"
const ruleForm = ref({})

const rules = {}
const getspace = async () => {
    const res = await service.get("/getUseSpace");
    console.log(res)
    ruleForm.value.totalSpace = res.data.totalSpace

}
const setrl = async () => {
    if (ruleForm.value.totalSpace > 999999999999999999) {
        return ElMessage({
            type: 'warning',
            message: "不可超过最大容量"
        })
    } else {
        const res = await service.post("/updateTotalSpace", {
            totalSpace: ruleForm.value.totalSpace
        })
        console.log(res);
        if (res.code == 1) {
            ElMessage({
                type: 'success',
                message: "修改成功，重新登录后生效"
            })
        }

    }

}
onMounted(() => {
    getspace()
})
</script>